import React from 'react';
import { connect } from 'dva'
import Tools from 'utils/tools'

import moment from 'moment'

import { FillAbstract } from 'components/Abstract'
import Title from 'components/Title'

import { config } from 'utils'
const { scada } = config;
const {
  Token,
  Interval,
  StationIds,
  STypes,
  DTypes,
  SupplyId,
} = scada;

const nowTimeStamp = Date.now();
const now = new Date(nowTimeStamp);
const month = moment(now).format('YYYY-MM')

@connect(({ index }) => ({ ...index }))
class Indicators extends React.Component {
  abstractConf = [
    {
      label: '月供水量', field: 'waterSupply', unit: 'm³', icon: 'output1',
      server: {
        type: 'index/queryStationList',
        payload: { type: 'Indicators' }
      }
    },
    {
      label: '月售水量', field: 'waterSell', unit: 'm³', icon: 'yield1',
      server: {
        type: 'index/queryWaterUse',
        payload: { type: 'Indicators' }
      }
    },
    { label: '产销差', field: 'waterSubtract', unit: 'm³', icon: 'line1' },
    { label: '产销差率', field: 'waterSubtractRadio', unit: '%', icon: 'pie' }
  ]

  constructor(props) {
    super(props);

    this.state = {
      month,
    }
  }

  componentDidMount() {
    this.init()
  }

  init = async () => {
    await this.setDateIndicators()
  }

  // 获取指标
  setDateIndicators = async () => {
    const { abstractConf } = this;
    abstractConf.map(ele => {
      const { server } = ele;
      if (server) this.queryServer(server);
    })
  }

  queryServer = async (server) => {
    const { month } = this.state;
    const startOfMonth = moment(month).startOf('month');
    const endOfMonth = moment(month).endOf('month');

    let { payload, type } = server;
    // 供水量
    if(type === 'index/queryStationList'){
      const { supply } = StationIds;
      Object.assign(payload, {
        Token,
        Interval,
        STypes,
        DTypes,
        Begin: startOfMonth.unix(),
          End: endOfMonth.unix(),
          StationId: supply.join(','),
      })
      // Object.assign(payload, {"Token":"5d5cae0f3daecf13f4b3bd2a","StationId":"5d418edd3daecf0148164367","Begin":1546300800,"End":1575072000,"STypes":["5d3967b33daecf0f50b9952b","5d3967b33daecf0f50b9952a"],"DTypes":["SSLL","SJLJ"],"Interval":86400})
    // 售水量
    }else if(type === 'index/queryWaterUse'){
      Object.assign(payload, {
        startDate: startOfMonth.format('YYYY-MM-DD'),
        endDate: endOfMonth.format('YYYY-MM-DD'),
      })
    }
    await this.props.dispatch(server);
  }

  render() {
    const { abstractConf, props } = this;

    // 售水累加
    const waterSell = Tools.countSellWater(props.WaterUseResourceIndicators);
    // 供水量
    const waterSupply = Tools.countSupplyWater(props.SupplyWaterResourceIndicators);
    // 产销差
    const waterSubtract = waterSupply - waterSell;
    // 产销差率
    const waterSubtractRadio = waterSupply === 0 ? 0 : (waterSubtract / waterSupply * 100).toFixed(2);

    const data = { waterSupply, waterSell, waterSubtract, waterSubtractRadio }
    return (
        <Title title={'重点指标监控'} style={{ paddingLeft: '4%', paddingRight: '4%' }}>
          <FillAbstract className={'col-12'}
            dataSource={data}
            columns={abstractConf} />
        </Title>
    )
  }
}

export default Indicators;
